angular.module('BaseControl')

.directive("btn", [function() {
    return {
        restrict: "E",	// 指令是一个元素 (并非属性)，备选项有"A"、"E" 和 "C"， "M" ,分别代表attribute、element、class和comment（默认值为"A"）
        scope: {
            value: '@'
        },
        template: 		// 替换HTML (使用scope中的变量)
        '<div class="Button" ng-show="Visible" ng-disabled="!Enabled">{{value}}</div>',
        replace: true,			// 使用模板替换原始标记
        transclude: true,		// 不复制原始HTML内容
        controller:function(){
        },
        link: function (scope, element, attrs) {
            scope.Enabled = true;
            scope.Visible = true;

            scope.$watch(
                function(){
                    return attrs["enabled"];
                },
                function(){
                    if (attrs["enabled"] != undefined && attrs["enabled"].trim().toLocaleLowerCase() == "false") {
                        scope.Enabled = false;
                        element[0].style.cursor = "not-allowed";
                        element[0].style.pointerEvents = "none";
                        element[0].style.opacity = 0.65;
                    }
                    else{
                        scope.Enabled = true;
                        element[0].style.pointerEvents = "all";
                        element[0].style.cursor = "pointer";
                        element[0].style.opacity = 1;
                    }
                }
            );

            scope.$watch(
                function(){
                    return attrs["visible"]
                },
                function(){
                    if (attrs["visible"] != undefined && attrs["visible"].trim().toLocaleLowerCase() == "false") {
                        scope.Visible = false;
                    }
                    else{
                        scope.Visible = true;
                    }
                }
            );
        }
    }
}]);
